<template>
  <div class="bigData_bg flex-column">
    <!--  head-->
    <el-container>
      <el-header>
        <div class="head flex-row justify-center p-2">
          <div class="font-44 bold text-white ml-1">陕西省健康科普资源库</div>
        </div>
        <div class="flex-row align-center justify-between px-1 mt-2">
          <div class="head-bottom flex-row align-center justify-center py-2" v-for="(item,index) in data31" :key="index">
            <img src="../../../assets/img/bigData/data-img.png" alt="" style="width: 40px;height: 67px">
            <div class=" ml-2">
              <div class="font-16 text-white bold">{{item.name}}</div>
              <div class="font-24 text-main bold mt-1">{{item.value}}</div>
            </div>
          </div>
        </div>
      </el-header>
    <!--  main-->
      <el-main>
        <BigDatapage4></BigDatapage4>
      </el-main>
    </el-container>
  </div>
</template>

<script>
import BigDatapage4 from './bigDatapage4'
export default {
  components: {
    BigDatapage4
  },
  name: 'bigData2',
  data () {
    return {
      data31:[],
    }
  },
  created() {
    this.getStatis31()
  },
  mounted () {

  },
  methods: {
    getdata(select,pageNo=1,rownumber=1000){
      return {
            "serviceName": select,
            "colNames": [
            "*"
            ],
            "condition": [],
            "relation_condition": {},
            "page": {
              "pageNo": pageNo,
              "rownumber": rownumber
            }
      }
    },
    getStatis31 () {
      let select = 'srvjk_cnt_jkzyk_main_select'
      this.$http.post(`/${select}?${select}`,this.getdata(select)).then(res => {
        if (res.data.state == 'SUCCESS') {
          let data = res.data.data[0]
          let lab = ['下载量','专家发布数','用户数','专家数','机构发布数','收藏量','浏览量','机构数']
          let mes = []
          let keys = Object.keys(data)
          for(let i=0;i<keys.length;i++){
            mes.push({
              name:lab[i],
              value:data[keys[i]]
            })
          }
          this.data31 = mes
        }
      })
    },
  }
}
</script>

<style scoped>
@import "../../../assets/scss/pages/data.scss";
.text-main{
  color: #00D8FF;
}
.el-col{
  height: 100%;
}
.bigData_bg{
  width: 100%;
  height: 100%;
  background: url("../../../assets/img/bigData/bg.png");
  background-size: 100% 100%;
}
/deep/.el-container{
  height: 100%;
}
/deep/.el-header{
  height: 2.5rem !important;
  padding: 0!important;
}
.head{
  background: url("../../../assets/img/bigData/data-head.png");
  background-size: 100% 100%;
}
.head-bottom{
   background: url("../../../assets/img/bigData/data-num1.png");
  width: 14%;
   background-size: 100% 100%;
 }
/deep/.el-main{
  padding: 10px !important;
}
</style>
